<template>
	<view class="invite_wrapper">
		<!-- 联系我们页面 -->
		<view class="invite_image_top">
			<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/user/iamge.png"></image>
		</view>
		<!-- 轮播图 -->
		<swiper class="swiper" :indicator-dots="true" :autoplay="false">
			<swiper-item>
				<view class="swiper_item">
					<view class="swiper_item_background">
						<view class="swiper_item_lists">
							<view class="swiper_item_lists_qq"></view>
							<view class="swiper_item_lists_number"> 官方QQ:&nbsp;&nbsp;{{qq}}</view>
							<view class="swiper_item_lists_copy" @click="qqCopyCode"> 复制号码</view>
						</view>
						<view class="swiper_item_border">
							<view></view>
							<view></view>
							<view></view>
							<view></view>
							<view></view>
							<view></view>
							<view></view>
							<view></view>
							<view></view>
							<view></view>
							<view></view>
							<view></view>
							<view></view>
							<view></view>
							<view></view>
						</view>
						<!-- 二维码 -->
						<view class="swiper_item_image">
							<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/user/qq.png"></image>
						</view>
					</view>
				</view>
			</swiper-item>
			<swiper-item>
				<view class="swiper_item_background">
					<view class="swiper_item_lists">
						<view class="swiper_item_lists_WeChat"></view>
						<view class="swiper_item_lists_number"> 官方微信:&nbsp;&nbsp;{{weChart}}</view>
						<view class="swiper_item_lists_copy" @click="weChartCopy"> 复制号码</view>
					</view>
					<view class="swiper_item_border">
						<view></view>
						<view></view>
						<view></view>
						<view></view>
						<view></view>
						<view></view>
						<view></view>
						<view></view>
						<view></view>
						<view></view>
						<view></view>
						<view></view>
						<view></view>
						<view></view>
						<view></view>
					</view>
					<!-- 二维码 -->
					<view class="swiper_item_image">
						<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/user/wechat.jpg"></image>
					</view>
				</view>
			</swiper-item>
		</swiper>
	</view>
</template>
<script>
	// import QR from '../../static/js/qrcode.js'
	export default {
		data() {
			return {
				inviteCode: '123456789',
				qq: "",
				weChart: "",
			}
		},
		onReady() {
			// this.getInviteCode();
			var value = uni.getStorageSync('user_info');
			if (value) {
				this.qq = value.wechat
				this.weChart = value.wx
			}
		},
		onLoad() {
		},
		onPullDownRefresh() {
			// this.getInviteCode();
		},
		methods: {
			// 店家按钮复制验证码
			weChartCopy() {
				uni.setClipboardData({
					data: this.weChart,
					success() {
						uni.showToast({
							title: '复制成功'
						})
					}
				})
			},
			qqCopyCode() {
				uni.setClipboardData({
					data: this.qq,
					success() {
						uni.showToast({
							title: '复制成功'
						})
					}
				})
			}
		}
	}
</script>
<style lang="scss" scoped>
	.invite_wrapper {
		background: #FAFAFA;
		padding-top: 90upx;
		box-sizing: border-box;
		height: 100vh;
		.invite_image_top {
			height: 180upx;
			margin: 0 auto;
			margin-bottom: 82upx;

			image {
				width: 100%;
				height: 100%;
			}
		}
		.swiper {
			width: 750upx;
			height: 862upx;
			background-color: #FAFAFA;

			.swiper_item_background {
				background: url("https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/user/wechatImage.png") no-repeat;
				background-size: 100% 100%;
				box-shadow: 0 4upx 4upx 4upx #F4F4F4;
				background-color: #F4F4F4;
				width: 610upx;
				height: 714upx;
				margin: 0 auto;
				margin-top: 30upx;
				border-radius: 10upx 10upx 10upx 10upx;

				.swiper_item_lists {
					display: flex;
					align-items: center;
					justify-content: center;
					height: 166upx;

					.swiper_item_lists_qq {
						background: url("https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/user/qqIcon.png") no-repeat;
						background-size: 100% 100%;
						width: 32upx;
						height: 39upx;
					}

					.swiper_item_lists_WeChat {
						background: url("https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/user/wechatIcon.png") no-repeat;
						background-size: 100% 100%;
						width: 43upx;
						height: 34upx;
					}

					.swiper_item_lists_number {
						font-size: 13px;
						margin: 0 16upx 0 11upx;
					}

					.swiper_item_lists_copy {
						color: #E03E4D;
						border-bottom: 1px solid #E03E4D;
						font-size: 10px;
					}
				}
			}
			.swiper_item_border {
				display: flex;
				justify-content: space-around;
				padding: 0 15upx;
				box-sizing: border-box;
				margin-top: 5upx;

				view {
					width: 18upx;
					border: 1upx solid #FEC766;
				}
			}
			.swiper_item_image {
				width: 445upx;
				height: 445upx;
				margin: 45upx auto 0;

				image {
					width: 100%;
					height: 100%;
				}
			}
		}
	}
</style>
